const path = require('path')
const {CleanWebpackPlugin} = require('clean-webpack-plugin')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const {VueLoaderPlugin} = require('vue-loader')

module.exports = () => {
    return {
        mode: 'none',
        entry: './src/main.js',  //入口文件
        module: {
            rules: [
                {
                    test: /.png$/,
                    use: {
                        loader: 'url-loader',
                        options: {
                            esModule: false,
                            limit: 10 * 1024,
                            path: path.join(__dirname, 'dist/assets'),// 输出文件目录  要绝对路径
                        },
                    }
                },
                {
                    test: /.less|.css$/,
                    use: [{
                        loader: 'vue-style-loader'
                    }, {
                        loader: 'css-loader'
                    }, {
                        loader: 'less-loader',
                        options: {
                            sourceMap: true
                        }
                    }]
                },
                {
                    test: /.js$/,
                    use: [{
                        loader: 'babel-loader',
                        options: {
                            presets: [
                                '@vue/cli-plugin-babel/preset'
                            ]
                        }
                    }, {
                        loader: 'eslint-loader',
                        options: {
                            fix: true
                        }
                    }],
                    exclude: /node_modules/
                },
                {
                    test: /.vue$/,
                    use: [{
                        loader: 'vue-loader'
                    }]
                },
            ]
        },
        plugins: [
            new CleanWebpackPlugin(),
            new VueLoaderPlugin(),
            new HtmlWebpackPlugin({
                template: "./public/index.html",
                filename: './index.html',
                title: '这个是title',
                favicon: './public/favicon.ico',
            }),
        ],
        resolve: {
            //引入路径是不用写对应的后缀名
            extensions: ['.js', '.vue', '.json'],
            //缩写扩展
            alias: {
                //正在使用的是vue的运行时版本，而此版本中的编译器时不可用的，我们需要把它切换成运行时 + 编译的版本
                'vue$': 'vue/dist/vue.esm.js',// 'vue/dist/vue.common.js' for webpack 1
                //用@直接指引到src目录下，如：'./src/main'可以写成、'@/main'
                '@': path.resolve(__dirname, './src'),
            }
        },
    }
}
